import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
// import 'package:toutiao/tt/search/SearchBody.dart';

class SearchInputTxt extends StatefulWidget {
  // SearchBody searchBody;

  @override
  createState() => new _SearchInputTxtState();

  SearchInputTxt();
}

class _SearchInputTxtState extends State<SearchInputTxt> {
  TextEditingController _controller;
  String dropMenuSelected = "article";
  TextStyle textStyle;

  // SearchBody searchBody;

  _SearchInputTxtState();

  @override
  void initState() {
    super.initState();
    _controller = new TextEditingController(text: '请输入你要搜索的内容');
    textStyle = TextStyle(fontSize: 14, color: Colors.grey);
  }

  void _onChange(String txt) {
    print(txt);
    setState(() {
      if (txt.length == 0) {
        textStyle = TextStyle(fontSize: 14, color: Colors.grey);
        _controller.text = "请输入你要搜索的内容";
      }
    });
  }

  void _textFieldOnTap() {
    _controller.clear();
    textStyle = TextStyle(fontSize: 14, color: Colors.black);
  }

  void dropChange(String value) {}

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new TextField(
        enabled: true,
        textAlign: TextAlign.left,
        //给TextField设置装饰（形状等）
        //输入文本的样式
        style: textStyle,
        controller: _controller,
        //最大行数
        maxLines: 1,
        autofocus: false,
        onChanged: _onChange,
        onTap: _textFieldOnTap,
        decoration: InputDecoration(
            border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(5.0),
                borderSide: BorderSide(color: Colors.transparent)),
            //  contentPadding: EdgeInsets.only(left: 2, top: 2, bottom: 2, right: 2),
            fillColor: Colors.white,
            filled: true,
            // 以下属性可用来去除TextField的边框
            enabledBorder: OutlineInputBorder(
                borderRadius: BorderRadius.circular(5.0),
                borderSide: BorderSide(color: Colors.transparent)),
            focusedBorder: OutlineInputBorder(
                borderRadius: BorderRadius.circular(5.0),
                borderSide: BorderSide(color: Colors.transparent)),
            suffixIcon: Icon(
              Icons.search,
              color: Colors.grey,
              size: 20.0,
            ),
            prefixIcon: Padding(
              padding: const EdgeInsets.only(left: 10, right: 10),
              child: new DropdownButton(
                  value: dropMenuSelected,
                  underline: null,
                  onChanged: (value) {
                    setState(() {
                      this.dropMenuSelected = value;
                    });
                  },
                  items: [
                    new DropdownMenuItem(
                        value: "article",
                        child: Text("文章",
                            style:
                                TextStyle(fontSize: 12, color: Colors.black))),
                    new DropdownMenuItem(
                        value: "ask",
                        child: Text("问答",
                            style:
                                TextStyle(fontSize: 12, color: Colors.black))),
                  ]),
              //suffixIcon: _suffixIcon
            )));
  }
}
